<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
      
<head th:include="head :: htmlhead" th:with="title='协议生成管理'"></head>

<h1 align="center" style="color:#FF5722"  th:text="'当前使用的版本为'+${version}"> </h1>
	<a th:href="'/zproto/module/viewModule?version='+${version}"><p align="center">回到模块页</p>
</a>

<body>
<input id="version" th:value="${version}" hidden="true">
<input id="id" th:value="${id}" hidden="true">
<!--<i id="data1" th:value="${data1}"></i>-->
<form class="layui-form" action="" lay-filter="example">
    <!-- 对象表格 -->
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
	  <legend>模块对象信息</legend>
	</fieldset>

    <table class="layui-hide" id="beanInfo" lay-filter="beanInfo"></table>
 	<script type="text/html" id="barDemo1">
  	  <!--<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>-->
  	  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
	</script>
	
<!--     依赖对象表格 -->
	<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
	  <legend>依赖对象定义</legend>
	</fieldset>
    <table class="layui-hide" id="assistBeanInfo" lay-filter="assistBeanInfo"></table>
 	<script type="text/html" id="barDemo2">
  	  <!--<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>-->
	  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> 
	</script> 
	
	<div class="layui-form-item" style="margin-top:  20px;">
        <div class="layui-input-block">
		<button id="button" type="button" class="layui-btn" lay-submit lay-filter="replaceAll">立即提交</button>
        </div>
    </div>
</form>

<script type="text/javascript"  th:inline="none">
layui.use('table', function(){
	  var table = layui.table;
	  var version=$("#version").val();
	  var moduleId=$("#id").val();
	  var beanData = []
	  $.ajax({
			url: '/zproto/module/dataBeanList?version='+version+'&id='+moduleId,
			type: 'GET',
			dataType: 'json',
			async : false,
			success: function(data) {
				if(data.code == 0){
					beanData = data.data
				}
			}
		});
	  table.render({
	    elem: '#beanInfo'
// 	    ,url:'/zproto/module/dataBeanList?version='+version+'&id='+moduleId
		,data:beanData
	    ,toolbar: 'default' //开启头部工具栏，并为其绑定左侧模板
	    ,title: '用户数据表'
    	,totalRow: true
	    ,cols: [
	    	[
	    		{type: 'checkbox', fixed: 'left'}
	    		,{field: 'indexId', title: 'ID', align:'center', width:80}
                ,{field: 'field', title: '字段', edit: 'text'}
                ,{field: 'type', title: '类型', edit: 'text'}
                ,{field: 'desc', title: '描述', edit: 'text'}
                ,{field: 'init', title: '默认初始化', edit: 'text'}
                ,{field: 'keyword', title: '关键字', edit: 'text'}
//                 ,{fixed: 'right', title:'操作', toolbar: '#barDemo'}
	    	]
	    ]
// 	  ,done: function (res, curr, count) {
//           // 如果是异步请求数据方式，res即为你接口返回的信息。
//           // 如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
//           $("[data-field='type']").children().each(function () {
// 				console.log("====>"+$(this).text());
//           });
//       }
	  });
	  //监听头工具栏事件
	  table.on('toolbar(beanInfo)', function(obj){
	    var checkStatus = table.checkStatus(obj.config.id)
	    ,data = checkStatus.data; //获取选中的数据
	    switch(obj.event){
	      case 'add':
	    	  var dataBak = [];
	    	  var tableBak = table.cache.beanInfo; 
	    	  for (var i = 0; i < tableBak.length; i++) {
    		  		dataBak.push(tableBak[i]);      //将之前的数组备份
    		  }
	    	  var indexId = 0;
	    	  if(dataBak.length > 0){
	    		  indexId = dataBak[dataBak.length-1].indexId + 1;
	    	  }else{
	    		  indexId = 1;
	    	  }
	    	  dataBak.push({
	    		    "indexId":indexId
	    		    ,"field": ""
	    		    ,"type": ""
	    		    ,"desc": ""
	    		    ,"init": ""
	    		    ,"keyword": ""
	    		});
	    	  console.log("=====>data:"+JSON.stringify(dataBak));
	    	  table.reload("beanInfo",{
	    		    data:dataBak,   // 将新数据重新载入表格
	    		});
// 	        layer.open({
// 	            type: 2 //此处以iframe举例
// 	            ,title: '新增字段'
// 	            ,area: ['400px', '500px']
// 	            ,shade: 0
// 	            ,maxmin: true
// 	            ,offset: [ //为了演示，随机坐标
// 	                0
// 	                ,0
// 	            ]
// 	            ,content: '/zproto/module/addBeanPropertiesView'
// 	            ,zIndex: layer.zIndex //重点1
// 	            ,success: function(layero){
// 	                layer.setTop(layero); //重点2
// 	            }
// 	        });
	      break;
	      case 'update':
	        if(data.length === 0){
	          layer.msg('请选择一行');
	        } else if(data.length > 1){
	          layer.msg('只能同时编辑一个');
	        } 
	        else {
	          layer.alert('编辑 [id]：'+JSON.stringify(checkStatus.data[0].field));
	        }
	      break;
	      case 'delete':
	        if(data.length === 0){
	          layer.msg('请选择一行');
	        }
	        else {
	        	layer.confirm('真的删除么?', function(index){
	        		layer.close(index);
		        	var tableBak = table.cache.beanInfo;
		        	$.each(data, function (index, value){
						for (let i = tableBak.length - 1; i >= 0; i--) {
						    if (tableBak[i].indexId === value.indexId) {
						    	tableBak.splice(i, 1);
						    }
						}
		        	})
		        	table.reload("beanInfo",{
		    		    data:tableBak,   // 将新数据重新载入表格
		    		});
	        	});
	        }
	      break;
	    };
	  });
	  
// 	  //监听行工具事件
// 	  table.on('tool(beanInfo)', function(obj){
// 	    var data = obj.data;
// 	    if(obj.event === 'del'){
// 	      layer.confirm('真的删除行么', function(index){
// 	        obj.del();
// 	        layer.close(index);
// 	      });
// 	    } else if(obj.event === 'edit'){
// 	      layer.prompt({
// 	        formType: 2
// 	        ,value: data.email
// 	      }, function(value, index){
// 	        obj.update({
// 	          email: value
// 	        });
// 	        layer.close(index);
// 	      });
// 	    }
// 	  });
	});
	
// $("#button").click(function(){
// 	var dataBak = [];
// 	 var table = layui.table;
// 	  var tableBak = table.cache.beanInfo; 
// 	  for (var i = 0; i < tableBak.length; i++) {
// 	  		dataBak.push(tableBak[i]);      //将之前的数组备份
// 	  }
// // 	  var len = tableBak.length;
// 	  dataBak.push({   
// 		  "indexId":0
// 		  ,"field": "1"
// 		    ,"type": "1"
// 		    ,"desc": "1"
// 		    ,"init": "1"
// 		    ,"keyword": "1"
// 		});
// 	  console.log("=====>data:"+JSON.stringify(dataBak));
// 	  table.reload("beanInfo",{
// 		  data: dataBak
// 		})
// });
	
</script>

<script type="text/javascript"  th:inline="none">
layui.use('table', function(){
	  var table = layui.table;
	  var version=$("#version").val();
	  var moduleId=$("#id").val();
	  
	  table.render({
	    elem: '#assistBeanInfo'
	    ,url:'/zproto/module/dataAssistBeanList?version='+version+'&id='+moduleId
	    ,toolbar: 'default' //开启头部工具栏，并为其绑定左侧模板
	    ,defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
	      title: '提示'
	      ,layEvent: 'LAYTABLE_TIPS'
	      ,icon: 'layui-icon-tips'
	    }]
	    ,title: '用户数据表'
    	,totalRow: true
	    ,cols: [
	    	[
	    		{type: 'checkbox', fixed: 'left'}
	    		//,{field: 'indexId', title: 'ID', align:'center', width:80}
                ,{field: 'entityName', title: '依赖对象名', edit: 'text', fixed: 'left'}
                ,{field: 'field', title: '字段', edit: 'text', fixed: 'left'}
                ,{field: 'type', title: '类型', edit: 'text'}
                ,{field: 'desc', title: '描述', edit: 'text'}
                ,{field: 'init', title: '默认初始化', edit: 'text'}
                ,{field: 'keyword', title: '关键字', edit: 'text'}
//                 ,{fixed: 'right', title:'操作', toolbar: '#barDemo'}
	    	]
	    ]
	  });
	  //监听头工具栏事件
	  table.on('toolbar(assistBeanInfo)', function(obj){
	    var checkStatus = table.checkStatus(obj.config.id)
	    ,data = checkStatus.data; //获取选中的数据
	    switch(obj.event){
	      case 'add':
	        layer.open({
	            type: 2 //此处以iframe举例
	            ,title: '新增字段'
	            ,area: ['400px', '500px']
	            ,shade: 0
	            ,maxmin: true
	            ,offset: [ //为了演示，随机坐标
	                0
	                ,0
	            ]
	            ,content: '/zproto/module/addBeanPropertiesView'
	            ,zIndex: layer.zIndex //重点1
	            ,success: function(layero){
	                layer.setTop(layero); //重点2
	            }
	        });
	      break;
	      case 'update':
	        if(data.length === 0){
	          layer.msg('请选择一行');
	        } else if(data.length > 1){
	          layer.msg('只能同时编辑一个');
	        }
// 	        else {
// 	          layer.alert('编辑 [id]：'+ checkStatus.data[0].id);
// 	        }
	      break;
	      case 'delete':
	        if(data.length === 0){
	          layer.msg('请选择一行');
	        }else if(data.length >= 2){
	          layer.msg('防误删,每次最多删除1条数据');
	        } 
// 	        else {
// 	        	var dels = [];
// 	        	data.forEach(function(n,i){
// 	        		dels.push(n.version);
// 	        	});
// 	        	layer.confirm('真的删除么?', function(index){
// 	                layer.close(index);
// 	                $.ajax({
// 	                    type: 'get',
// 	                    url: '/zproto/setting/deleteVersion',
// 	                    dataType:"json", //返回格式为json
// 	                    data:{versions:dels}, //参数值
// 	                    contentType: 'application/x-www-form-urlencoded',
// 	                    success: function(ret){
// 	                        if(ret.code==0){
// 	                            layer.alert("删除成功！");
// 	                            location.reload();//重新加载页面表格
// 	                        }else{
// 	                            layer.alert(ret.tips);
// 	                        }
// 	                    },
// 	                    error: function(jqXHR){console.log(jqXHR)},
// 	                });
// 	                //向服务端发送删除指令
// 	            });
// 	        }
	      break;
	    };
	  });
	  
// 	  //监听行工具事件
// 	  table.on('tool(assistBeanInfo)', function(obj){
// 	    var data = obj.data;
// 	    if(obj.event === 'del'){
// 	      layer.confirm('真的删除行么', function(index){
// 	        obj.del();
// 	        layer.close(index);
// 	      });
// 	    } else if(obj.event === 'edit'){
// 	      layer.prompt({
// 	        formType: 2
// 	        ,value: data.email
// 	      }, function(value, index){
// 	        obj.update({
// 	          email: value
// 	        });
// 	        layer.close(index);
// 	      });
// 	    }
// 	  });
	});
</script>

<script>
//表格内容全部提交到服务器
//清空功能
layui.use(['form', 'table'], function(){
    var form = layui.form;
	var table = layui.table;
    form.on('submit(replaceAll)', function (data) {
    	var d = {}
    	d.version = $("#version").val();
    	d.moduleId = $("#id").val();
    	d.propertiesDtos = table.cache.beanInfo;
    	d.assistPropertiesDtos = table.cache.assistBeanInfo;
    	//console.log("=====>dddd:"+JSON.stringify(d));
        $.ajax({
            type: 'POST',
            url: '/zproto/module/saveDataBean',
            dataType: 'json',
            data: JSON.stringify(d),
            contentType: "application/json; charset=utf-8",
            success: function(data){
				//layer.alert(data.tips)
				var str = data.tips;
				if(data.code == 0){
					layer.msg(str, {icon: 1});
				}else{
					layer.msg(str, {icon: 2});
				}
            },
            error: function(jqXHR){console.log(jqXHR)},
        });
        return false;
});});

</script>

</body>
</html>
